<template>
    <div class="index">

        <div class="app">
            <h2>hallo！我是曹腾力
            </h2>
        </div>
        <dir></dir>
        <div class="new">
            <New />
        </div>
        <dir></dir>
        <div class="new1">
            <New1 />
        </div>

    </div>
</template>
<script>
//接受组件New
import New from './components/New.vue'
import New1 from './components/计算长方形的面积.vue';
import New2 from './components/用li列出对象内容.vue';
export default {
    name: 'App',
    //注册New组件
    components: {
        New,
        New1,
        New2
    }
}
</script>
<style>
.index{
    width:85%;
    margin-left: 350px;
}
.new{
    margin-bottom: 30px;
}
.app {
    background-color: #ddd;
    box-shadow: 0 0 5px;
    border-radius: 8px;
    padding: 10px;
    text-align: center;
    height: 50px;
    margin: 0 auto;
}

</style>